<template>
<q-layout view="hHh Lpr fFf">
    <!-- Be sure to play with the Layout demo on docs -->

    <!-- (Optional) The Header -->
    <q-header :class="isShow?'back-dark shadow-7':'transparent'">
        <q-toolbar class="transparent " style="width: 100%; height: 50px">
            <q-btn @click="handleBack" falt round icon="mdi-keyboard-backspace"></q-btn>
            <q-img v-if="isShow" src="icons/一方映画logo200708竖版亮色.png" :width="$q.platform.is.mobile ? '150px' : '200px'" contain />

            <q-space></q-space>
            <!-- <q-bar dark style="height: 60px" class="transparent">

                  <q-space />

                  <q-btn flat dense  @click="handleMinWin" :class="isShow?'':'shadow-7'" icon="mdi-minus" class="items-center">

                      <q-tooltip>窗口还原(Esc)</q-tooltip>
                  </q-btn>
                  <q-btn flat dense :class="isShow?'':'shadow-7'"  icon="crop_square" @click="handleMaxWin">
                      <q-tooltip>窗口最大化</q-tooltip>
                  </q-btn>
                  <q-btn flat dense :class="isShow?'':'shadow-7'"  icon="mdi-format-list-bulleted" @click="leftDrawer = !leftDrawer" />

              </q-bar> -->
            <!-- <q-btn flat round dense icon="menu" class="mobile-only q-mr-sm" /> -->
        </q-toolbar>
    </q-header>

    <!-- (Optional) The Footer -->
    <q-footer v-model="isShow" class="row back-dark items-center" style="height:40px">
        <!-- <q-btn flat round size="15px" dense icon="list" @click="leftDrawer = !leftDrawer" /> -->
        <span class="q-ml-md">{{fileNum}}个项目</span>
    </q-footer>

    <q-page-container>

        <!-- This is where pages get injected -->
        <router-view ref="VideolistContainer" @update="handleFileNum" :user="user" :isShow="isShow" />
    </q-page-container>

</q-layout>
</template>


<script>
export default {
    props: {
        user: {
            type: Object
        }
    },
    data() {
        return {
            leftDrawer: true,
            pid: '',
            isUploadDialog: false,
            uploadheaders: {},
            recceList: [],
            isFull: false,
            isShow: true,
            fileNum: 0
        }
    },
    created() {
        this.pid = this.$route.params.pid;
        this.projectInfo = this.$store.state.projectinfo;

        this.i_name = setInterval(() => {
          this.projectInfo = this.$store.state.projectinfo;
            if (this.projectInfo.name) {
                document.title = this.projectInfo.name + '--素材列表';
                clearInterval(this.i_name)
            }

        }, 500);

    },
    mounted() {
        this.$emit('isSingle', true)
    },
    watch: {
        '$q.fullscreen.isActive'(val) {
            // if (val) {
            //     this.isShow = false;
            // } else {
            //     this.isShow = true;
            // }

            console.log(val ? 'In fullscreen now' : 'Exited fullscreen')
        }
    },
    beforeDestroy() {
        this.$emit('isSingle', false)
    },
    methods: {
        handleFileNum(val) {
            this.fileNum = val
        },
        handleBack() {
            this.$router.replace('/studio/' + this.pid)
        },
        loadRecce(item) {
            console.log(this.$refs.recceContainer, item);
            let serverurl = this.GLOBAL.serveurl;

        },
        handleMinWin() {
            // this.isShow = false;
            this.$q.fullscreen
                .exit()
                .then(() => {
                    // v1.5.0+
                    // success!
                })
                .catch((err) => {
                    // v1.5.0+
                    // oh, no!!!
                });
        },
        handleMaxWin() {
            // this.isShow = false;
            this.$q.fullscreen
                .request()
                .then(() => {
                    console.log(this.$refs);
                })
                .catch((err) => {
                    // v1.5.0+
                    // oh, no!!!
                });
        },
        handleUploadDialog() {
            this.isUploadDialog = true;
        }

    }
}
</script>
